The CSS1 formatting model

Cascading style sheets are based on a simple block-oriented formatting model. Each element consists of one or more rectangular blocks, each of which has a core content area with optional surrounding padding, border, and margin areas.

This formatting model gives you much more flexibility in controlling spacing between objects. For example, by setting the top margin of one element to a negative value, you can make it grow into another element directly above it.

To best visualize the block concept, choose a background color for an element:

The result is a colored block that extends over the entire width of the page and whose height is controlled by its text content. You should set aside a little time to experiment with those properties--for example, set the padding to move the text within away from the edge of the block.

For instructions on setting the margin, border, and padding properties, see Block properties.

Using Cascading Style Sheets > About cascading style sheets > The CSS1 formatting model